<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover" />
    <title>设置主页</title>
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <link rel="stylesheet" href="/addons/jquery-weui-build/css/weui.min.css">
    <link rel="stylesheet" href="/addons/jquery-weui-build/css/jquery-weui.css">
    <link rel="stylesheet" href="/css/system/front-iconfont.css?v=2018121301">
    @if($skinid == 3)
        <link rel="stylesheet" href="/css/system/common.css">
        <link rel="stylesheet" href="/css/system/set-up.css?v=2018121301">
    @elseif($skinid == 1)
        <link rel="stylesheet" href="/css/theme-blue/system/common.css">
        <link rel="stylesheet" href="/css/theme-blue/system/set-up.css">
    @elseif($skinid == 2)
        <link rel="stylesheet" href="/css/theme-pink/system/iconfont-pink.css">
        <link rel="stylesheet" href="/css/theme-pink/system/common.css">
        <link rel="stylesheet" href="/css/theme-pink/system/set-up.css">
    @endif
    <link rel="stylesheet" href="/css/icon/iconfont-0130.css">
</head>
<body ontouchstart>
<div class="mian-container">
    <div class="main-con set-up">
        <div class="setup-top weui-cell">
            <div class="btn-weui weui-cell__hd">
                <img class="full-topimg" src="{{ !empty($user->user_logo) ?asset($user->user_logo).'?v='.time():'/img/list-demo1.png'}}">
                <p class="btn-p">修改头像</p>
            </div>
            <div class="setup-bd weui-cell__bd">
                <p class="change-ctitle">{{$user->qw_name}}</p>
                <i class="change-icon icon iconfont icon-xiugai pc-btn"></i>
            </div>
        </div>
        <div class="weui-cells">
            <a class="change-skin weui-cell weui-cell_access" href="{{url('/front/my-company')}}">
                <div class="weui-cell__hd">
                    @if($skinid == 3)
                        <img src="/img/com-1.png">
                    @elseif($skinid == 1)
                        <img src="/img-theme-blue/com.png">
                    @elseif($skinid == 2)
                        <img src="/img-theme-pink/s6.png">
                    @endif
                </div>
                <div class="weui-cell__bd">
                    <p>所属企业</p>
                </div>
                <div class="weui-cell__ft">
                    @if($skinid == 3)
                        <img src="/img/com-img.png">
                    @elseif($skinid == 1)
                        <img src="/img-theme-blue/com-img.png">
                    @elseif($skinid == 2)
                        <img src="/img-theme-pink/com-img.png">
                    @endif
                    <span>{{getCompanyName($user->corpid,2)}}</span>
                </div>
            </a>
            <a class="change-skin weui-cell weui-cell_access chg-skin" href="javascript:void(0);">
                <div class="weui-cell__hd">
                    @if($skinid == 3)
                        <img src="/img/setup-skin1.png">
                    @elseif($skinid == 1)
                        <img src="/img-theme-blue/s4.png">
                    @elseif($skinid == 2)
                        <img src="/img-theme-pink/s1.png">
                    @endif
                </div>
                <div class="weui-cell__bd">
                    <p>更换皮肤</p>
                </div>
                <div class="weui-cell__ft">
                    <input readonly type="text" id="in" @if($skinid ==3) value="清新绿" @elseif($skinid == 2) value="可爱粉" @else value="商务蓝" @endif data-values="{{$user->skinid}}">
                </div>
            </a>
        </div>
        <a class="login-out weui-btn_color" href="{{url('/front/user-logout')}}">退出登录</a>
    </div>
    @include('frontuser.caidan')
   {{-- <div class="reful-tabbar">
        <a href="javascript:void(0)" class="kaohe-item tabbar-item ">
            <i class="icon iconfont icon-kaoping icon-footer"></i>
            <p class="tabbar-label">考评</p>
        </a>
        <a href="{{url('/user/message/index')}}" class="tabbar-item ">
            <i class="icon iconfont icon-yinliang icon-footer"></i>
            <p class="tabbar-label">消息中心</p>
        </a>
        <a href="{{url('/user/reward/reward')}}" class="tabbar-item ">
            <i class="icon iconfont icon-jinggao icon-footer"></i>
            <p class="tabbar-label">奖励惩罚</p>
        </a>
        <a href="javascript:void(0)" class="set-btn tabbar-item active">
            <i class="icon iconfont icon-shezhi1-copy icon-footer"></i>
            <p class="tabbar-label">设置</p>
        </a>
    </div>--}}
    <!--图片裁剪-->
    <div class="clipbg displaynone">
        <div id="clipArea"></div>
        <div class="loading displaynone">正在载入图片...</div>
        <div class="footer">
            <dl>
                <dd style="background: #fe1041; color: #ffffff;border: none;">打开相册<input type="file" id="file" accept="image/*" ></dd>
                <dd id="clipBtn">完成裁剪</dd>
            </dl>
            <div class="back">取消</div>
        </div>
    </div>

    <div class="shadow-hidden"></div>
    <div class="hidden-sec">
        <div class="popup"><h3>修改公司内昵称</h3><i class="weui-icon-cancel"></i></div>
        <form onsubmit="return false;">
            <p>用户名</p>
            <input type="text" value="{{$user->qw_name}}" name="nickname">
            {!! csrf_field() !!}
            <button type="submit" class="sub-mit modi-nickname">保存</button>
        </form>
    </div>
    <div class="hidde-theme">

    </div>
</div>
<script src="/js/jquery-2.1.4.min.js"></script>
<script src="/addons/jquery-weui-build/js/fastclick.js"></script>
<script>
    $(function() {
        document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
        FastClick.attach(document.body);
    });
</script>
<script src="/addons/jquery-weui-build/js/jquery-weui.min.js"></script>
<script src="/addons/phtotclip/hammer.min.js"></script>
<script src="/addons/phtotclip/iscroll-zoom-min.js"></script>
<script src="/addons/phtotclip/lrz.all.bundle.js?v=1"></script>
<script src="/addons/phtotclip/photoClip.js?v=1"></script>
<script src="/js/common.js"></script>
<script>

    $(document).ready(function () {
        $('.modi-nickname').click(function () {
            var token = $('input[name=_token]').val();
            var name = $('input[name=nickname]').val();
            $.ajax({
                url:'/front/modify-nickname?_token='+token,
                type:'post',
                dataType:'json',
                data:{'name':name},
                error: function (request) {
                    $.toast('网络错误',"text");
                },
                success: function (data) {
                    if (data.status == 'success') {
                        $.toast(data.msg);
                        setTimeout(function(){ window.location.reload(); }, 1000);
                    } else {
                        $.toast(data.msg,"text");
                    }
                },
            });
        });

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
//        $('.chg-skin').click(function(){
            $("#in").select({
                title: "<p class='pre-view'>预览</p>",
                autoClose:false,
                items: [
                    {
                        title: "商务蓝",
                        value: 1
                    },
                    {
                        title: "可爱粉",
                        value: 2
                    },
                    {
                        title: "清新绿",
                        value: 3
                    }
                ],
                onChange: function () {
                    var valueid = this.data.values
                    $('.pre-view').click(function () {
                        $('.shadow-hidden').css('display','block');
                        $('.hidde-theme').html("<img src='/img/"+valueid+".jpg'>");
                        $('.hidde-theme').css('display','block');
                    })
                },
                onClose:function(){
                    var token = $('input[name=_token]').val();
                    var skinid = $('#in').attr('data-values');
                    $.ajax({
                        url:'/front/change-skin?_token='+token,
                        type:'post',
                        dataType:'json',
                        data:{'skinid':skinid},
                        error: function (request) {
                            $.toast('网络错误',"text");
                        },
                        success: function (data) {
                            if (data.status == 'success') {
                                $.toast(data.msg);
                                setTimeout(function(){ window.location.reload(); }, 1000);
                            } else {
                                $.toast(data.msg,"text");
                            }
                        },
                    });
                }
            });
//        })
        $('.hidde-theme').click(function () {
            $('.shadow-hidden').css('display','none');
            $('.hidde-theme').css('display','none');
        })
        //上传头像start
        $(".btn-p").click(function(){
            $(".clipbg").fadeIn()
        })
        var clipArea = new  PhotoClip("#clipArea", {
            size: [300, 300],//裁剪框大小
            outputSize:[0,0],//打开图片大小，[0,0]表示原图大小
            file: "#file",
            ok: "#clipBtn",
            loadStart: function() { //图片开始加载的回调函数。this 指向当前 PhotoClip 的实例对象，并将正在加载的 file 对象作为参数传入。（如果是使用非 file 的方式加载图片，则该参数为图片的 url）
                $(".loading").removeClass("displaynone");

            },
            loadComplete: function() {//图片加载完成的回调函数。this 指向当前 PhotoClip 的实例对象，并将图片的 <img> 对象作为参数传入。
                $(".loading").addClass("displaynone");

            },
            done: function(dataURL) { //裁剪完成的回调函数。this 指向当前 PhotoClip 的实例对象，会将裁剪出的图像数据DataURL作为参数传入。
                //console.log(dataURL)
                $.ajax({
                    'url': '/user/userLogo',
                    'type': 'POST',
                    'data': {'dataURL': dataURL},
                    error: function (request) {
                        $.toptip("网络异常请重试",'warning');
                    //    setTimeout(function(){window.location.reload();},2000);

                    },
                    success: function (data) {
                        if (data.status == 'success') {
                            $.toptip("头像修改成功",'success');

                        } else {
                            $.toptip("网络异常请重试",'warning');
                            setTimeout(function(){window.location.reload();},2000);
                        }
                    },
                });
                $('.full-topimg').attr("src",dataURL);
                $(".clipbg").fadeOut();
            }
        });
        $(".back").click(function(){
            $(".clipbg").fadeOut();
        })
        //上传头像end
        $('.question-btn').click(function(){
            $.toast("上传的头像建议png格式", "text");
        })
        $('.kaohe-item').click(function(){
            $('.front-show-hidden').toggle();
        })
        $('.set-btn').click(function () {
            $('.set-hidden').toggle();
        })
      /*  $('.change-icon').click(function(){
            var input=$('<textarea type="text" class="weui-textarea edit-com">'+$('.change-ctitle').text()+'</textarea>');
            $('.change-ctitle').html(input);
            $('.edit-com').attr("readonly",false).focus();
            var result = $('.edit-com').val();
            $('.edit-com').val('');
            $('.edit-com').val(result);
            $('.edit-com').click(function(){
                return false;
            });
            $('.edit-com').blur(function(){
                $('.change-ctitle').html($(this).val());
            })
        })*/
        $('.pc-btn').click(function () {
            $('.shadow-hidden').css('display','block');
            $('.hidden-sec').css('display','block');
        })
        $('.hidden-sec .popup i').click(function () {
            $('.hidden-sec').css('display','none');
            $('.shadow-hidden').css('display','none');
        })
    })
</script>
</body>
</html>